<template>
  <div id="allmap" :style="{height:mapheight}" />
</template>

<script>
import BMap from 'BMap'
export default {
  props: ['mapheight'],
  data() {
    return {
    }
  },
  mounted() {
    this.createMap()
  },
  methods: {
    createMap() {
      // 批量
      var points = [new BMap.Point(106.50784495092026, 29.547884037577926),
        new BMap.Point(106.539455, 29.562494),
        new BMap.Point(106.342503, 29.519189),
        new BMap.Point(106.545384, 29.583505),
        new BMap.Point(106.541394, 29.581733),
        new BMap.Point(106.403771, 29.806811),
        new BMap.Point(106.342596, 29.519774)
      ]

      // 地图初始化
      var bm = new BMap.Map('allmap')
      var point = new BMap.Point(29.5710002000, 106.5571394000)
      bm.centerAndZoom(point, 12)
      // 坐标转换完之后的回调函数
      const translateCallback = function(data) {
        if (data.status === 0) {
          for (var i = 0; i < data.points.length; i++) {
            bm.addOverlay(new BMap.Marker(data.points[i]))
            bm.setCenter(data.points[i])
            // var marker = new BMap.Marker(point) // 创建标注
            // bm.addOverlay(marker) // 将标注添加到地图中
            // var opts = {
            //   width: 200, // 信息窗口宽度
            //   height: 100, // 信息窗口高度
            //   title: '花卉园' // 信息窗口标题
            // }
            // const info = '花卉园花卉园花卉园花卉园花卉园'
            // var infoWindow = new BMap.InfoWindow(info, opts) // 创建信息窗口对象
            // marker.addEventListener('click', function() {
            //   bm.openInfoWindow(infoWindow, point) // 开启信息窗口
            // })
            // var myGeo = new BMap.Geocoder()
            // myGeo.getPoint('重庆市渝中区黄花园', function(point) {
            //   if (point) {

            //   } else {
            //     alert('您选择地址没有解析到结果!')
            //   }
            // }, '重庆')
          }
        }
      }
      setTimeout(function() {
        var convertor = new BMap.Convertor()
        convertor.translate(points, 1, 5, translateCallback)
      }, 1000)
      bm.enableScrollWheelZoom(true) // 开启鼠标滚轮缩放
      // 单个信息弹窗
      // var map = new BMap.Map('allmap')
      // var point = new BMap.Point(29.5710002000, 106.5571394000) // 设置中心原点
      // map.centerAndZoom(point, 12) // 地图级别

      // var myGeo = new BMap.Geocoder()
      // myGeo.getPoint('重庆市渝北区花卉园', function(point) {
      //   if (point) {
      //     map.centerAndZoom(point, 12)
      //     var marker = new BMap.Marker(point) // 创建标注
      //     map.addOverlay(marker) // 将标注添加到地图中
      //     var opts = {
      //       width: 200, // 信息窗口宽度
      //       height: 100, // 信息窗口高度
      //       title: '花卉园' // 信息窗口标题
      //     }
      //     const info = '花卉园花卉园花卉园花卉园花卉园'
      //     var infoWindow = new BMap.InfoWindow(info, opts) // 创建信息窗口对象
      //     marker.addEventListener('click', function() {
      //       map.openInfoWindow(infoWindow, point) // 开启信息窗口
      //     })
      //   } else {
      //     alert('您选择地址没有解析到结果!')
      //   }
      // }, '重庆')
      // map.enableScrollWheelZoom(true) // 开启鼠标滚轮缩放
    }
  }
}
</script>
<style>

</style>
